<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>筛选详情</title>
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <meta name="renderer" content="webkit">
	<link rel="stylesheet" type="text/css" href="/css/base.css">
	<link rel="stylesheet" type="text/css" href="/css/screendetails.css?1">
</head>
<script src="/js/jquery-3.1.1.min.js"></script>
<script src="/js/layer/layer.js"></script>
<body>
<form>
<div class="userHome">
	<div class="homeTitle">
		<a href="/index/index/index"><div class="homeTitleMind">前锋图书馆</div></a>
	</div>
	<div class="contentTitleWrap">
		<div class="librarybooks contentTitle checked"><span class="contentTiltleinfo">馆内图书</span></div>
		<div class="lendbooks contentTitle"><span class="contentTiltleinfo">借出图书</span></div>
		<div class="overdue contentTitle"><span class="contentTiltleinfo">逾期未还</span></div>
	</div>
	{if condition="!empty($books)"}
	<div class="contentWarp">
		<div class="content">
		    {volist name="books" id="books"}
		    {if condition="$books.bstates==1"}
			<div class="booksWrap">
				<div class="booksImg"><img src="{$books.img}" class="bookImg"></div>
				<div class="booksName">
					<span class="bookNameinfo">《{$books.bname}》</span>
				</div>
				{if condition="$books.type==1"}
				<div class="applysBtn">
					<span class="applysBtninfo"><input type="hidden" class="bookid" value="{$books.id}">已申请</span>
				</div>
				{else /}
				<div class="applyBtn">
					<span class="applyBtninfo"><input type="hidden" class="bookid" value="{$books.id}">申请借阅</span>
				</div>
				{/if}
			</div>
			{/if}
			{/volist}
			<div class="clearfloat"></div>
		</div>
		<!-- <div class="page_control">
			<div class="paginationOut">
				<div class="pagination1"></div>
			</div>
		</div> -->
	</div>
	<div class="contentWarp contentWarp1  hidden">
		<div class="content1">
			{volist name="bookout" id="val"}
			<div class="booksWrap1">
				<div class="booksImg1"><img src="{$val.img}" class="bookImg1"></div>
				<div class="booksName1">
					<span class="bookNameinfo1">《{$val.bname}》</span>
				</div>
				<div class="booksPeople">
					<span class="booksPeopleinfo">借阅人：{$val.uname|default="暂无"}</span>
				</div>
				<div class="booksTime">
					<span class="booksTimeinfo">借阅时间：{$val.booktime|default="暂无"}至{$val.expectedReturnTime|default="暂无"}</span>
				</div>
				{if condition="$val.power==1"}
				<div class="applyssBtn1">
					<span class="applyssBtninfo1">没有预约权限</span>
				</div>
				{elseif condition="$val.type==1" /}
				<div class="applysBtn1">
					<span class="applysBtninfo1"><input type="hidden" class="booksid" value="{$val.bid}">已预约</span>
				</div>
				{else /}
				<div class="applyBtn1">
					<span class="applyBtninfo1"><input type="hidden" class="booksid" value="{$val.bid}">预约</span>
				</div>
				{/if}
			</div>
			{/volist}
			<div class="clearfloat"></div>
		</div>
		<!-- <div class="page_control">
			<div class="paginationOut">
				<div class="pagination2"></div>
			</div>
		</div> -->
	</div>

	<div class="contentWarp contentWarp2 hidden">
		<div class="content2">
			{volist name="bookout" id="val"}
			{if condition="!empty($val.overtime)"}
			<div class="booksWrap2">
				<div class="booksImg2"><img src="{$val.img}" class="bookImg2"></div>
				<div class="booksName2">
					<span class="bookNameinfo2">《{$val.bname}》</span>
				</div>
				<div class="booksPeople2">
					<span class="booksPeopleinfo2">借阅人：{$val.uname|default="暂无"}</span>
				</div>
				<div class="booksTime2">
					<span class="booksTimeinfo2">借阅时间：{$val.booktime|default="暂无"}至{$val.expectedReturnTime|default="暂无"}</span>
				</div>
				<div class="booksTime2">
					<span class="booksPeopleinfo2">逾期时间：{$val.overtime|default="暂无"}天</span>
				</div>
			</div>
			{/if}
			{/volist}
			<div class="clearfloat"></div>
		</div>
		<!-- <div class="page_control">
			<div class="paginationOut">
				<div class="pagination3"></div>
			</div>
		</div> -->
	</div>
	<div class="page_control">
			<div class="paginationOut">
				<div class="pagination1 hidden"></div>
				<div class="pagination2 hidden"></div>
				<div class="pagination3 hidden"></div>
			</div>
		</div>
</div>
{/if}
</form>
</body>
<script src="/js/jquery.paging.js"></script>
<script type="text/javascript">
	$(function(){
		var tabBtnNum=0;
		$(".contentTitle").click(function(){
			tabBtnNum=$(this).index();
			$(".contentWarp").addClass('hidden');
			$(".contentWarp").eq(tabBtnNum).removeClass('hidden');
			$(".contentTitle").removeClass('checked');
			$(".contentTitle").eq(tabBtnNum).addClass('checked');
			if(tabBtnNum==0){
				$(".pagination1").empty();
				$(".pagination2").empty();
				$(".pagination3").empty();
				$(".pagination2").hide();
				$(".pagination3").hide();
				page1();
			}else if(tabBtnNum==1){
				$(".pagination1").empty();
				$(".pagination2").empty();
				$(".pagination3").empty();
				$(".pagination1").hide();
				$(".pagination3").hide();
				page2();
			}else if(tabBtnNum==2){
				$(".pagination1").empty();
				$(".pagination2").empty();
				$(".pagination3").empty();
				$(".pagination2").hide();
				$(".pagination1").hide();
				page3();
			}
		});
	})
</script>
<script>
//申请借阅
var bnum;
$(".content").on('click','.applyBtn',function(){
	bnum = $(this).index('.applyBtn');
	// alert(bnum);
	var bookid = $(this).find('input').val();
	$.ajax({
        type: "POST",
        url: "/index/screendetails/doapply",
        data: {'bookid': bookid},
        dataType: "json",
        timeout: 3000,
        success: function (data) {
            console.log(data)
            if(data==1){
                layer.msg('已申请！', {
                    icon: 1,
                    time: 1000
                }, function () {
                	var bhtml = '';
                	bhtml += '<div class="applysBtn">';
                	bhtml += '<span class="applysBtninfo"><input type="hidden" class="bookid" value="{$books.id}">已申请</span></div>';
                    $(".applyBtn").eq(bnum).replaceWith(bhtml);
                });
            }else{
                layer.msg('申请失败！', {
                    icon: 2,
                    time: 1000
                });  
            }
        }
    });
})
//取消申请
var bnums;
$(".content").on('click','.applysBtn',function(){
	bnums = $(this).index('.applysBtn');
	// alert(bnums);
	var bookid = $(this).find('input').val();
	$.ajax({
        type: "POST",
        url: "/index/screendetails/cancelapply",
        data: {'bookid': bookid},
        dataType: "json",
        timeout: 3000,
        success: function (data) {
            console.log(data)
            if(data==1){
                layer.msg('取消成功！', {
                    icon: 1,
                    time: 1000
                }, function () {
                	var bhtml = '';
                	bhtml += '<div class="applyBtn">';
                	bhtml += '<span class="applyBtninfo"><input type="hidden" class="bookid" value="{$books.id}">取消申请</span></div>';
                    $(".applysBtn").eq(bnums).replaceWith(bhtml);
                });
            }else{
                layer.msg('取消失败！', {
                    icon: 2,
                    time: 1000
                });  
            }
        }
    });
})
//预约书籍
var wantnum;
$(".content1").on('click','.applyBtn1',function(){
	wantnum = $(this).index('.applyBtn1');
	// alert(wantnum);
	var booksid = $(this).find('input').val();
	$.ajax({
        type: "POST",
        url: "/index/screendetails/doapply",
        data: {'bookid': booksid},
        dataType: "json",
        timeout: 3000,
        success: function (data) {
            console.log(data)
            if(data==1){
                layer.msg('预约成功！', {
                    icon: 1,
                    time: 1000
                }, function () {
                	var bhtml = '';
                	bhtml += '<div class="applysBtn1">';
                	bhtml += '<span class="applysBtninfo1"><input type="hidden" class="booksid" value="{$val.bid}">已预约</span></div>';
                    $(".applyBtn1").eq(wantnum).replaceWith(bhtml);
                });
            }else{
                layer.msg('预约失败！', {
                    icon: 2,
                    time: 1000
                });  
            }
        }
    });
})
//取消预约
var wantnums;
$(".content1").on('click','.applysBtn1',function(){
	wantnums = $(this).index('.applysBtn1');
	// alert(wantnums);
	var booksid = $(this).find('input').val();
	$.ajax({
        type: "POST",
        url: "/index/screendetails/cancelapply",
        data: {'bookid': booksid},
        dataType: "json",
        timeout: 3000,
        success: function (data) {
            console.log(data)
            if(data==1){
                layer.msg('取消成功！', {
                    icon: 1,
                    time: 1000
                }, function () {
                	var bhtml = '';
                	bhtml += '<div class="applyBtn1">';
                	bhtml += '<span class="applyBtninfo1"><input type="hidden" class="booksid" value="{$val.bid}">预约</span></div>';
                    $(".applysBtn1").eq(wantnums).replaceWith(bhtml);
                });
            }else{
                layer.msg('取消失败！', {
                    icon: 2,
                    time: 1000
                });  
            }
        }
    });
})
</script>
<script>
$(function(){
	page1();
})
//馆内图书分页
function page1(){
	$('.pagination1').paging({
	    total: '',
	    currentPage: '',
	    showPage: 5,        //显示的页数
	    animation: false,
	    showJump: false,
	    ajaxSubmitType: 'post',
	    simpleType: 1,
	    url: '/index/screendetails/pageBookRecord',
	    idParameter: "page",
	    ajaxData: {'pageType': 1},
	    beforeAjaxSubmit: function () {
	        PageAPI.AddAjaxData({"pageSize": $(".pageSize").val()});
	    },
	    ajaxSubmitBack: function (data) {
	        console.log(data);
	        $('.content').empty();
	        var orderinfo = data.data;
	        console.log(orderinfo);
	        var infohtml='';	
	        if(orderinfo=='' ||orderinfo==undefined){
	            $(".content").html(' <h2 style="text-align: center;padding-top:120px;height: 166px;color: red;">暂无数据</h2>');
	            $(".pagination1").hide();
	        }else{
	        	$(orderinfo).each(function(i,val){       	
			        infohtml+='<div class="booksWrap">';
			        infohtml+='<div class="booksImg"><img src="'+val.img+'" class="bookImg"></div>';
			        infohtml+='<div class="booksName">';
			        infohtml+='<span class="bookNameinfo">《'+val.bname+'》</span></div>';
			        if(val.type==1){
			            infohtml+='<div class="applysBtn">';
			            infohtml+='<span class="applysBtninfo"><input type="hidden" class="bookid" value="'+val.id+'">已申请</span></div>';
			        }else{
			            infohtml+='<div class="applyBtn">';
			            infohtml+='<span class="applyBtninfo"><input type="hidden" class="bookid" value="'+val.id+'">申请借阅</span></div>';
			        }
			        infohtml+='</div>'; 
		        });
		        $(".content").html(infohtml);
		        var info='<div class="clearfloat"></div>';
		        $(".content").append(info);
		        $(".pagination1").show();
	        }
	    },
	    ajaxFormatBack: function (data) {
	        data.total = data.totalpage;
	        data.currentPage = data.currentPage;
	    }
	});
}

//借出图书分页
function page2(){
	$('.pagination2').paging({
	    total: '',
	    currentPage: '',
	    showPage: 5,        //显示的页数
	    animation: false,
	    showJump: false,
	    ajaxSubmitType: 'post',
	    simpleType: 1,
	    url: '/index/screendetails/pageBookRecords',
	    idParameter: "page",
	    ajaxData: {'pageType': 1},
	    beforeAjaxSubmit: function () {
	        PageAPI.AddAjaxData({"pageSize": $(".pageSize").val()});
	    },
	    ajaxSubmitBack: function (data) {
	        console.log(data);
	        $('.content1').empty();
	        var orderinfo = data.data;
	        console.log(orderinfo);
	        var infohtml='';	
	        if(orderinfo=='' ||orderinfo==undefined){
	            $(".content1").html(' <h2 style="text-align: center;padding-top:120px;height: 166px;color: red;">暂无数据</h2>');
	            $(".pagination2").hide();
	        }else{
	        	$(orderinfo).each(function(i,val){ 
			        infohtml+='<div class="booksWrap1">';
			        infohtml+='<div class="booksImg1"><img src="'+val.img+'" class="bookImg1"></div>';
			        infohtml+='<div class="booksName1">';
			        infohtml+='<span class="bookNameinfo1">《'+val.bname+'》</span></div>';
			        infohtml+='<div class="booksPeople">';
			        infohtml+='<span class="booksPeopleinfo">借阅人：'+val.uname+'</span></div>'; 
			        infohtml+='<div class="booksTime">';
			        infohtml+='<span class="booksTimeinfo">借阅时间：'+val.booktime+'至'+val.expectedReturnTime+'</span></div>';
			        if(val.power==1){
			        	infohtml+='<div class="applyssBtn1">';
			        	infohtml+='<span class="applyssBtninfo1">没有预约权限</span></div>';
			        }else if(val.type==1){
			        	infohtml+='<div class="applysBtn1">';
			        	infohtml+='<span class="applysBtninfo1"><input type="hidden" class="booksid" value="'+val.bid+'">已预约</span></div>';
			        }else{
			        	infohtml+='<div class="applyBtn1">';
			        	infohtml+='<span class="applyBtninfo1"><input type="hidden" class="booksid" value="'+val.bid+'">预约</span></div>';
			        }
			        infohtml+='</div>';
		        });
		        $(".content1").html(infohtml);
		        var info='<div class="clearfloat"></div>';
		        $(".content1").append(info);
		        $(".pagination2").show();
	        }

	    },
	    ajaxFormatBack: function (data) {
	        data.total = data.totalpage;
	        data.currentPage = data.currentPage;
	        
	    }
	});
}

//逾期未还分页
function page3(){
	$('.pagination3').paging({
	    total: '',
	    currentPage: '',
	    showPage: 100,        //显示的页数
	    animation: false,
	    showJump: false,
	    ajaxSubmitType: 'post',
	    simpleType: 1,
	    url: '/index/screendetails/pageBookRecordss',
	    idParameter: "page",
	    ajaxData: {'pageType': 1},
	    beforeAjaxSubmit: function () {
	        PageAPI.AddAjaxData({"pageSize": $(".pageSize").val()});
	    },
	    ajaxSubmitBack: function (data) {
	        console.log(data);
	        $('.content2').empty();
	        var orderinfo = data.data;
	        console.log(orderinfo);
	        var infohtml='';	
	        if(orderinfo=='' ||orderinfo==undefined){
	            $(".content2").html(' <h2 style="text-align: center;padding-top:120px;height: 166px;color: red;">暂无数据</h2>');
	            $(".pagination3").hide();
	        }else{
	        	$(orderinfo).each(function(i,val){       	
			        infohtml+='<div class="booksWrap2">';
			        infohtml+='<div class="booksImg2"><img src="'+val.img+'" class="bookImg2"></div>';
			        infohtml+='<div class="booksName2">';
			        infohtml+='<span class="bookNameinfo2">《'+val.bname+'》</span></div>';
			        infohtml+='<div class="booksPeople2">'; 
			        infohtml+='<span class="booksPeopleinfo2">借阅人：'+val.uname+'</span></div>'; 
			        infohtml+='<div class="booksTime2">'; 
					infohtml+='<span class="booksTimeinfo2">借阅时间：'+val.booktime+'至'+val.expectedReturnTime+'</span></div>'; 
					infohtml+='<div class="booksTime2">'; 
					infohtml+='<span class="booksPeopleinfo2">逾期时间：'+val.overtime+'天</span>'; 
					infohtml+='</div></div>'; 
		        });
		        $(".content2").html(infohtml);
		        var info='<div class="clearfloat"></div>';
		        $(".content2").append(info);
		        $(".pagination3").show();
	        }
	    },
	    ajaxFormatBack: function (data) {
	        data.total = data.totalpage;
	        data.currentPage = data.currentPage;
	    }
	});
}

</script>
</html>